<div ng-if="auth.isResetPassword">
    <div class="col s12 m6 offset-m3 left">
        <ul class="align-left">
            <li class="center">
                <span class="text-highlight">{{auth.deliveredMsg}}</span></li>
        </ul>
        <a ui-sref="auth.login" class="align-left">
            <button class="waves-effect waves-dark btn ev-btn-dark w-300" type="submit" value="Submit">Log In</button>
        </a>
    </div>
</div>
<div ng-if="!auth.isResetPassword">
    <div class="col s12 m6 offset-m3 left">
        <ul class="left">
            <li class="ev-horiz-list"><a ui-sref="auth.reset-password-confirm" class="light-link" ui-sref-active="active-auth" ng-click="auth.resetForm()">Enter Your New Password</a></li>
        </ul>
    </div>
    <div class="col s12 m6 offset-m3">
        <form name="resetconfirmForm" ng-submit="auth.resetPasswordConfirm(resetconfirmForm.$valid)" class="reset-password" novalidate>
            <!-- email -->
            <div class="input-field align-left">
                <input type="{{canShowPassword ? 'text' : 'password'}}" id="new_password1" onpaste="return false;" class="dark-autofill" name="new_password1" ng-model="auth.getUser.new_password1" minlength="8" required>
                <span class="form-icon form-icon-dark" ng-click="auth.togglePasswordVisibility()">
                    <i ng-if="!canShowPassword" class="fa fa-eye pointer"></i>
                    <i ng-if="canShowPassword" class="fa fa-eye-slash pointer"></i>
                </span>
                <label for="new_password1">New Password (min 8 characters) *</label>
                <div class="wrn-msg text-highlight" ng-messages="resetconfirmForm.new_password1.$error" ng-if="resetconfirmForm.new_password1.$touched || resetconfirmForm.$submitted">
                    <p ng-message="minlength">Password is less than 8 characters.</p>
                    <p ng-message="required">Password is required.</p>
                </div>
            </div>
            <div class="input-field align-left">
                <input type="{{canShowConfirmPassword ? 'text' : 'password'}}" id="new_password2" class="dark-autofill" name="new_password2" ng-model="auth.getUser.new_password2" minlength="8" compare-to="auth.getUser.new_password1" required>
                <span class="form-icon form-icon-dark" ng-click="auth.toggleConfirmPasswordVisibility()">
                    <i ng-if="!canShowConfirmPassword" class="fa fa-eye pointer"></i>
                    <i ng-if="canShowConfirmPassword" class="fa fa-eye-slash pointer"></i>
                </span>
                <label for="new_password2">Confirm new password *</label>
                <div class="wrn-msg text-highlight" ng-messages="resetconfirmForm.new_password2.$error" ng-if="resetconfirmForm.new_password2.$touched || resetconfirmForm.$submitted">
                    <p ng-message="compareTo">Password do not match</p>
                    <p ng-message="minlength">Password is less than 8 characters.</p>
                    <p ng-message="required">Password confirmation is required.</p>
                </div>
            </div>
            <div class="row">
                <br>
                <div class="col s6 align-left rm-gut">
                    <button class="waves-effect waves-dark btn ev-btn-dark w-300  grad-btn grad-btn-dark" type="submit" value="Submit">Submit</button>
                </div>
                <div class="col s6 align-right right rm-gut">
                    <a ui-sref="auth.login" class="light-link fg-pass">Back to Log In</a>
                </div>
            </div>
            <div ng-if="auth.isFormError" class="wrn-msg text-highlight align-left"> {{auth.FormError}}</div>
            <div>
                <p class="text-light-gray">
                    <span class="text-med-black">Start with a new account </span><a class="highlight-link" ui-sref="auth.signup" ng-click="auth.resetForm()"> Sign Up</a> 
                </p>
            </div>
        </form>
    </div>
</div>
